<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=0, width=device-width"/>
    <title>api</title>
    <link rel="stylesheet" type="text/css" href="../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../css/common.css" />
    <link rel="stylesheet" type="text/css" href="../css/base.css" />    
	
</head>
    <style type="text/css">
    
    .i-content {
    width: 100%;
    overflow: hidden;
}

html,body{
	height: 100%;
}

.li-top-1 {
    margin: 5px 5px 0px 5px;
    border: 1px solid #DCDCDC;
    height: 33px;
    border-top-left-radius: 0.5em;
    border-top-right-radius: 0.5em;
}

.li-top-1 h3 {
    font-size: 12px;
    font-weight: normal;
    overflow: hidden;
    height: 33px;
    line-height: 33px;
    margin-left: 8px;
}
.orange{
    color: #FF0000;
}
.record{
    float: right;
    margin-right: 10px;
    color: #0079fe;
    text-decoration: none;
    outline: none;

}


.myIntegral{
    border-bottom: 1px solid #DCDCDC;
    height: 40px;
}
.myIntegral h3{
    font-size: 12px;
    font-weight: normal;
    display: block;
    height: 40px;
    line-height: 40px;
    margin-left: 15px;
}

.chop_hand_price {
  
    overflow: hidden;
    padding: 0.1rem 0.1rem 0.08rem;
    border: 1px solid #DCDCDC;
    border-top: none;
    background-color: #fff;
    margin: 0px 5px;
    border-bottom-left-radius: 0.5em;
    border-bottom-right-radius: 0.5em;
}

.chop_hand_price .product_list .product_box .pic {
    margin-top: 0.8rem;
    width: 80%;
    /*height: 60%;*/
    overflow: hidden;
    margin-bottom: 0.08rem;
    margin-left: 0.8rem;
}
.chop_hand_price .product_list .product_box .pic img {
    width: 100%;
    height: 100%;
}
.price {
font-size: 13px;
    text-align: center;
    display: block;
}
.chop_hand_price {

    background-color: #fff;
}

.chop_hand_price .product_list .product_box h3 {
    margin-top: 10px;
    text-align: -webkit-center;
    display: block;
    white-space: nowrap;
    line-height: 18px;
    overflow: hidden;
    color: #666;
    font-size: 0.8rem;

    font-weight: normal;
}

.product_list {
    position: relative;

    padding-bottom: 0.1rem;
    -webkit-overflow-scrolling: touch;
    overflow-y: auto;
    white-space: nowrap;
    font-size: 0;
}

.i-buttom {
    margin-top: 10px;
    text-align: center;
}

.product_list .product_item {
    overflow: hidden;
    position: relative;
    display: inline-block;
    width: 30%;
    margin-bottom: 5px;
    font-size: 0.12rem;
    white-space: normal;
    vertical-align: top;
    margin-left: 8px;
}
.product_box{
    overflow: hidden;
}

.touchweb_page-index .chop_hand_price .product_list .icon_add_cart {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 0.36rem;
    height: 0.36rem;
    line-height: 0.36rem;
    text-align: center;
    font-size: 0.2rem;
    color: #ff3c25;
}

.w-button-main {
    background: #FF0000;
        padding: 7px 18px;
}

.w-button {
    font-size: 13px;
    white-space: nowrap;
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    border-width: 0;
    border-style: solid;
    border-color: #1B7DE0;
    border-radius: 3px;
    cursor: pointer;
    text-decoration: none !important;
    outline: none;
}
.w-msgbox {
    margin: 0 auto;
    min-width: 15rem;
    max-width: 50rem;
    position: fixed;
    z-index: 999;
    left: 14px;
    right: 14px;
    background: #fff;
    border-radius: 5px;
    color: #333;
}
.w-msgbox-bd {
    padding: 15px 20px;
}

.w-msgbox-ft .pro-btn {
    border: 1px solid #eee;
    margin-left: 10px;
    height: 30px;
    line-height: 30px;
    font-size: 14px;
    box-sizing: border-box;
    color: #1E96FD;
    border-radius: 5px;
    background: none;
    padding: 0;
    text-align: center;
    margin-bottom: 10px;
    color: #000000;
}
.pro-view-5,.pro-view-7{
    width: 100px;
}

.w-msgbox-title {
    text-align: center;
    font-size: 14px;
    font-weight: bold;
}
.m-login-msg {
    text-align: center;
}
.w-msgbox-ft {
    overflow: hidden;
    text-align: center;
}
.pro-mask {
    position: fixed;
    z-index: 998;
    -position: absolute;
    left: 0;
    top: 0;

    background: #000;
    opacity: .6;
    filter: alpha(opacity=60);
}

.w-msgbox-ft img {

    width: 70px;
    height: 30px;
    margin-top: 0;
    vertical-align: middle;
    margin-right: 7px;
    cursor: pointer;
}

.w-msgbox-ft input{
    width:140px;height:30px;margin-right:10px;
    border: 1px solid #eee;
    border-radius: 5px;
}
.ValidateCode{
    height: 30px;
}



    </style>
</head>
<body>
<script id='integrate-template' type="text/x-dot-template">
	 <div class="myIntegral"><h3>我的积分：<em class="orange">{{=it.jingyan}}</em> <a class=" record" onclick="openWin('integrateList',{{=it.uid}})">兑换记录</a></h3></div>
	 
</script>
   
    <div  class="content" >
        <section class="revealed">
        <div id='integrate-content'>
        	<div class="myIntegral"><h3>我的积分：<em class="orange"></em> <a class=" record" >兑换记录</a></h3></div>
        </div>
       <div id='exchange-ul' class="i-content">
            <ul >
                <li class="li-top-1">
                    <h3>余额兑换专区</h3>
                </li>
                <div class="chop_hand_price" id="chopHandPrice">
                    <div class="product_list" id="chopHandList">
                        
                        <div class="product_item ">
                            <div class="product_box">
                                <div class="pic">
                                    <img src="http://wap.jqmao.cn/statics/uploads/shopimg/20151023/36294607583698.jpg" alt="余额充值5元" class="">
                                </div>
                                <h3>余额充值5元</h3>

                                <div class="price_box">
                                    <span class="price">积分：<em class="orange">1000</em></span>
                                </div>
                            </div>
                            <div id="ddd" class="i-buttom"  i-m-data="5.00">
                                <buttom class="w-button w-button-main w-button-s" data="1" >立即兑换</buttom>
                            </div>
                        </div>
                        
                        <div class="product_item ">
                            <div class="product_box">
                                <div class="pic">
                                    <img src="http://wap.jqmao.cn/statics/uploads/shopimg/20151023/32812380583907.jpg" alt="余额充值10元" class="">
                                </div>
                                <h3>余额充值10元</h3>

                                <div class="price_box">
                                    <span class="price">积分：<em class="orange">1800</em></span>
                                </div>
                            </div>
                            <div id="ddd" class="i-buttom"  i-m-data="10.00">
                                <buttom class="w-button w-button-main w-button-s" data="13">立即兑换</buttom>
                            </div>
                        </div>
                        
                        <div class="product_item ">
                            <div class="product_box">
                                <div class="pic">
                                    <img src="http://wap.jqmao.cn/statics/uploads/shopimg/20151023/34424836584187.jpg" alt="余额充值15元" class="">
                                </div>
                                <h3>余额充值15元</h3>

                                <div class="price_box">
                                    <span class="price">积分：<em class="orange">2800</em></span>
                                </div>
                            </div>
                            <div id="ddd" class="i-buttom"  i-m-data="15.00">
                                <buttom class="w-button w-button-main w-button-s" data="14">立即兑换</buttom>
                            </div>
                        </div>
                        
                        <div class="product_item ">
                            <div class="product_box">
                                <div class="pic">
                                    <img src="http://wap.jqmao.cn/statics/uploads/shopimg/20151023/48296984584464.jpg" alt="余额充值20元" class="">
                                </div>
                                <h3>余额充值20元</h3>

                                <div class="price_box">
                                    <span class="price">积分：<em class="orange">3800</em></span>
                                </div>
                            </div>
                            <div id="ddd" class="i-buttom"  i-m-data="20.00">
                                <buttom class="w-button w-button-main w-button-s" data="15">立即兑换</buttom>
                            </div>
                        </div>
                                            </div>
                </div>
            </ul>
            <ul>
                <li class="li-top-1">
                    <h3>礼品兑换专区</h3>
                </li>
                <div class="chop_hand_price" id="chopHandPrice">
                    <div class="product_list" id="chopHandList">
                                                <div class="product_item ">
                            <div class="product_box">
                                <div class="pic">
                                    <img src="http://wap.jqmao.cn/statics/uploads/shopimg/20151021/42360269420754.jpg" alt="sense4移动电源" width="120" height="120" class="">
                                </div>
                                <h3>sense4移动电源</h3>
                                <div class="price_box">
                                    <span class="price">积分：<em class="orange">10000</em></span>
                                </div>
                            </div>
                            <div class="i-buttom" >
                                <buttom class="w-button w-button-main w-button-s" data="10">立即兑换</buttom>
                            </div>
                        </div>
                                                <div class="product_item ">
                            <div class="product_box">
                                <div class="pic">
                                    <img src="http://wap.jqmao.cn/statics/uploads/shopimg/20151021/74413704419417.jpg" alt="乐心运动手环" width="120" height="120" class="">
                                </div>
                                <h3>乐心运动手环</h3>
                                <div class="price_box">
                                    <span class="price">积分：<em class="orange">20000</em></span>
                                </div>
                            </div>
                            <div class="i-buttom" >
                                <buttom class="w-button w-button-main w-button-s" data="6">立即兑换</buttom>
                            </div>
                        </div>
                                                <div class="product_item ">
                            <div class="product_box">
                                <div class="pic">
                                    <img src="http://wap.jqmao.cn/statics/uploads/shopimg/20151021/56976958419544.jpg" alt="小米路由器" width="120" height="120" class="">
                                </div>
                                <h3>小米路由器</h3>
                                <div class="price_box">
                                    <span class="price">积分：<em class="orange">26000</em></span>
                                </div>
                            </div>
                            <div class="i-buttom" >
                                <buttom class="w-button w-button-main w-button-s" data="7">立即兑换</buttom>
                            </div>
                        </div>
                                                <div class="product_item ">
                            <div class="product_box">
                                <div class="pic">
                                    <img src="http://wap.jqmao.cn/statics/uploads/shopimg/20151021/51079157419813.jpg" alt="飞利浦迷你电饭锅" width="120" height="120" class="">
                                </div>
                                <h3>飞利浦迷你电饭锅</h3>
                                <div class="price_box">
                                    <span class="price">积分：<em class="orange">60000</em></span>
                                </div>
                            </div>
                            <div class="i-buttom" >
                                <buttom class="w-button w-button-main w-button-s" data="9">立即兑换</buttom>
                            </div>
                        </div>
                                                <div class="product_item ">
                            <div class="product_box">
                                <div class="pic">
                                    <img src="http://wap.jqmao.cn/statics/uploads/shopimg/20151021/65116002421255.jpg" alt="飞利浦剃须刀" width="120" height="120" class="">
                                </div>
                                <h3>飞利浦剃须刀</h3>
                                <div class="price_box">
                                    <span class="price">积分：<em class="orange">100000</em></span>
                                </div>
                            </div>
                            <div class="i-buttom" >
                                <buttom class="w-button w-button-main w-button-s" data="11">立即兑换</buttom>
                            </div>
                        </div>
                                                <div class="product_item ">
                            <div class="product_box">
                                <div class="pic">
                                    <img src="http://wap.jqmao.cn/statics/uploads/shopimg/20151021/79552958421653.jpg" alt="iPadAir2" width="120" height="120" class="">
                                </div>
                                <h3>iPadAir2</h3>
                                <div class="price_box">
                                    <span class="price">积分：<em class="orange">500000</em></span>
                                </div>
                            </div>
                            <div class="i-buttom" >
                                <buttom class="w-button w-button-main w-button-s" data="12">立即兑换</buttom>
                            </div>
                        </div>
                                                <div class="product_item ">
                            <div class="product_box">
                                <div class="pic">
                                    <img src="http://wap.jqmao.cn/statics/uploads/shopimg/20151023/56499703585515.jpg" alt="iphone&nbsp;6s&nbsp;64G&nbsp;" width="120" height="120" class="">
                                </div>
                                <h3>iphone&nbsp;6s&nbsp;64G&nbsp;</h3>
                                <div class="price_box">
                                    <span class="price">积分：<em class="orange">1200000</em></span>
                                </div>
                            </div>
                            <div class="i-buttom" >
                                <buttom class="w-button w-button-main w-button-s" data="16">立即兑换</buttom>
                            </div>
                        </div>
                                            </div>
                </div>
            </ul>

        </div>
        <p class="red" style="margin: 10px 10px">特别声明：奖励由本公司提供,与苹果官方无关。</p>
    </section>
    
    </div>

</body>
    <script type="text/javascript" src="../script/zepto.min.js"></script>

    <script type="text/javascript" src="../script/api.js"></script>
    <script type="text/javascript" src="../script/doT.min.js"></script>
    <script type="text/javascript" src="../script/common.js"></script>
    <script type="text/javascript" src="../script/login.js"></script>
    <script type="text/javascript">
    
      	var user = '';
      	var integrate = '';
      	var uid = '';
      	apiready = function(){
      	 
       
      		reload()
            exchange();
      	}
      	
      	function reload(){
      		api.execScript({
            name: 'root',
            frameName: 'user',
            script: 'userReload()'
        });
            api.addEventListener({
			    name: 'user'
			}, function(ret, err){
					uid = ret.value.uid;
			      	var a = $api.byId('integrate-content');
		            var tpl = $api.byId('integrate-template').text;
		            var tempFn = doT.template(tpl);
		            $api.html(a,tempFn(ret.value));
			
			});
      	}
      	//兑换
      	function exchange(){
      		
      		var ul = $api.byId('exchange-ul');
      		
      		$api.addEvt(ul, 'click', function (e) {
      		
      			if(e.target.getAttribute("data")){
      			var id = e.target.getAttribute("data");
      			var url = 'http://wap.jqmao.cn/exchange';
      			var data = {values:{uid:uid,id:id}};
      				api.confirm({
				    title: '积分兑换',
				    msg: '亲，是否确定兑换？',
				    buttons: ['确定', '取消']
						}, function(ret, err){
				    	var index = ret.buttonIndex;
				    	if(index==1){
				    		api.ajax({
					        	url: url,
					       			 method: 'post',
					       			 data: data
			                           
					    		},function(ret,err){
					    		
					    		
					    			if(ret){
					    				
					    				if(ret.code=='3'){
					    					toast('亲，积分不够哦!')
					    				}else if(ret.code=='0'){
					    					reload();
					    					toast('兑换成功!')
					    				}else{
					    					toast('亲，兑换失败，稍后再试！')
					    				}
					    			}else{
					    				//alert(JSON.stringify(err))
					    			}
					    		
					    			
					    	})
				    	}
				    })
      			}
      		})
      	
      	}
    </script>

</html>
